import React, {Component} from 'react'
import styles from './card.less'
import classNames from 'classNames'
import PropTypes from 'prop-types'
import {withRouter} from 'dva/router'

class Card extends Component {
  constructor(props) {
    super(props);
  }

  goDetail(id) {
    this.props.history.push(`/book/${id}`)
  }

  render() {
    const {cardInfo, index} = this.props
    return (
      <div className={classNames(styles.card, (index + 1) % 4  == 0 && styles.no_marginRight)} onClick={this.goDetail.bind(this, cardInfo.id)}>
        <div className={styles.font0}>
          <img src={cardInfo.cover}/>
        </div>
        <div className={styles.cardInfoContainer}>
          <div className={styles.courseName}>
            {cardInfo.title}
          </div>
          <div className={styles.courseBuy}>
            <span className={styles.coursePrice}>
              <span>¥ </span>
              {(cardInfo.price / 100).toFixed(2)}
            </span>
            <span className={styles.courseCount}>
              {`${cardInfo.buyers}已购买`}
            </span>
          </div>
        </div>
      </div>
    );
  }
}

Card.propTypes = {
  cardInfo: PropTypes.object,
  index: PropTypes.number
}

export default withRouter(Card)